@media (max-width: 768px) {
  .main-site-title p {
    font-size: 18px;
  }
  .main-site-title {
    height: 8%;
  }
  .main-site-title img {
    width: 15%;
    margin-right: 2%;
  }
}
@media (max-width: 480px) {
  .main-site-title p {
    font-size: 22px;
  }
}

.main-site-title p{
  box-sizing: border-box;
}

.main-site-title {
  display: flex;
  align-items: center;
  font-family: Simpsons;
  background: #ff0;
  border: 4px solid #000;
  color: #fff;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000,
    1px 1px 0 #000;
  height: 12%;
  justify-content: flex-start;
}

.main-site-title img {
  width: 9%;
  min-width: 50px;
  margin-right: 3%;
}
.main-site-title p {
  font-size: 36px;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: scale(1);
  text-align: left;
  padding-left: 10px;
  flex-grow: 1;
}

.page-title {
  font-family: Mario256;
  font-size: 50px;
  padding-right: 15px;
  margin: 30px 0 15px;
  text-align: center;
}